import Vue from 'vue'
import VueRouter from 'vue-router'
import login from '../page/login.vue'   //非懒加载方式

Vue.use(VueRouter)

const routes = [
  {
    path: '/',                   //重定向到登录页
    redirect: '/login'
  },
  {
    path: '/login',    //登录页面
    name: 'login',
    component: login
  },
  {
    path: '/home',
    name: 'home',
    redirect: "/index",
    component: () => import('../views/index.vue'),  //懒加载方式
    children: [
      {
        path: '/index',                     //首页
        name: 'index',
        meta: { title: "首页" },
        component: () => import('../views/management/index.vue')
      },
      {
        path: '/ActivityManagement',
        name: 'ActivityManagement',
        meta: { title: "vue指令小结" },
        component: () => import('../views/management/ActivityManagement.vue')
      },
      {
        path: '/activityList',
        name: 'activityList',
        meta: { title: "directiv指令" },
        component: () => import('../views/management/activityList.vue')
      },
      {
        path: '/pagethree',
        name: 'pagethree',
        meta: { title: "vuex小结" },
        component: () => import('../views/management/pagethree.vue')
      },


      {
        path: '/activitydetials',
        name: 'activitydetials',
        meta: { title: "一些小知识点" },
        component: () => import('../views/management/activitydetials.vue'),
        children: [
          {
            path: '/activitydetials/detailsOne',
            name: 'detailsOne',
            meta: { title: "css flex布局" },
            component: () => import('../views/management/detailsOne.vue'),
          },
          {
            path: '/activitydetials/detailstwo',
            name: 'detailstwo',
            meta: { title: "一个小算法" },
            component: () => import('../views/management/detailstwo.vue'),
          },
          {
            path: '/activitydetials/detailsthree',
            name: 'detailsthree',
            meta: { title: "ES6常用" },
            component: () => import('../views/management/detailsthree.vue'),
          }
        ]
      },
      {
        path: '/activityPlan',
        name: 'activityPlan',
        meta: { title: "css 动画" },
        component: () => import('../views/management/activityPlan.vue'),
        children: [
          {
            path: '/activityPlan/PlanOne',
            name: 'PlanOne',
            meta: { title: "demo1" },
            component: () => import('../views/management/PlanOne.vue'),
          },
          {
            path: '/activityPlan/PlanTwo',
            name: 'PlanTwo',
            meta: { title: "动画demo2" },
            component: () => import('../views/management/PlanTwo.vue'),
            children: [
              {
                path: '/activityPlan/PlanTwo/One',
                name: 'one',
                meta: { title: "选项1" },
                component: () => import('../views/management/one.vue'),
              }
            ]
          },
          {
            path: '/activityPlan/PlanThree',
            name: 'PlanThree',
            meta: { title: "页面5-3" },
            component: () => import('../views/management/PlanThree.vue'),
          }
        ]
      },

      {
        path: '/pageSix',
        name: 'pageSix',
        meta: { title: "canvas" },
        component: () => import('../views/management/pageSix.vue'),
        children: [{
          path: '/pageSix/canvasdemo',
          name: 'canvasdemo',
          meta: { title: 'echart' },
          component: () => import('../views/management/canvasdemo.vue'),
        },
        {
          path: '/pageSix/vueExtendDemo',
          name: 'vueExtendDemo',
          meta: { title: '页面6-2' },
          component: () => import('../views/management/vueExtendDemo.vue'),
        }
        ]
      },
      {
        path: '/vueComponDemo',
        name: 'vueComponDemo',
        meta: { title: '组件封装' },
        component: () => import('../views/management/vueComponDemo/index.vue'),
      },
      {
        path: '/luckysheet',
        name: 'luckysheet',
        meta: { title: 'luckysheet' },
        component: () => import('../views/management/luckysheet.vue'),
      },
    ]
  },

]

const router = new VueRouter({
  routes
})


//路由拦截 防止信息泄漏，防止没有登录访问内容 在跳转前执行
router.beforeEach(function (to, from, next) {
  if (!sessionStorage.getItem("name")) {       //判断本地存储是否有登录信息值，如果有可以访问，如果没有需要到到登录页面登录
    if (to.path != "/login") {  //更严谨的判断
      next("/login");
    }
  }
  next();
});

export default router
